<template>
  <div class="dashboard-editor-container">
    <!-- <full-screen ref="fullscreen" :org-list="orgList" :total-money-info="totalMoneyInfo" /> -->
  </div>
</template>

<script>
// import PanelGroup from './components/PanelGroup';
// import LineChart from './components/LineChart';
// import fullScreen from './components/fullScreen/map-full';
// import { getUserOrgMax } from '@/api/common';
import { deepClone } from '@/utils';
// import { getTotalMoneyByOrgId, getMsgByOrgIdAndYear } from '@/api/insurance';
// import screenfull from 'screenfull';

export default {
  name: 'DashboardAdmin',
  components: {
    // PanelGroup,
    // fullScreen,
    // LineChart
  },
  data() {
    return {
      totalLoading: false,
      lineChartLoading: false,
      searchParam: {
        yearStr: '2021',
        orgId: ''
      },
      showMore: false,
      orgInfo: {},
      sumPrice: '',
      totalYear: {
        store: [],
        money: []
      },
      orgList: [],
      totalMoneyInfo: {}
    };
  },
  computed: {
    showChildList() {
      let result = this.totalMoneyInfo.childList;
      if (!this.showMore && result) {
        result = deepClone(result).splice(0, 6);
      }
      return result;
    }
  },
  mounted() {
    /** 获取组织机构的数据 */
    // getUserOrgMax().then(res => {
    //   const result = res.data;
    //   if (result.code === 0) {
    //     this.orgInfo = result.data;
    //     // this.getTotalMoney(result.data.id);
    //   }
    // });
  },
  methods: {
    showMoreFn() {
      this.showMore = !this.showMore;
    },
    changeTab(id) {
      this.orgList.forEach(el => {
        this.$set(el, 'checked', false);
        if (el.orgId === id) {
          this.$set(el, 'checked', true);
          this.searchParam.orgId = id;
          this.getTotalYear();
        }
      });
    },
    setOrgList(list) {
      this.orgList = [];
      list.forEach((el, index) => {
        const obj = {
          orgName: el.orgName,
          orgId: el.orgId,
          checked: false
        };
        this.orgList.push(obj);
      });
      this.orgList.unshift({ orgName: '全部', orgId: this.orgInfo.id, checked: true });
    },
    changeYears() {
      this.getTotalYear();
    },
    showScreen() {
      document.documentElement.requestFullscreen();
      this.$refs.fullscreen.dialog.showModal = true;
      this.$refs.fullscreen.totalYear = this.totalYear;
    }
  }
};
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.dashboard-editor-container {
  section{
    color: #333;
    padding: 32px 32px 60px;
    background: #fff;
    box-sizing: border-box;
    margin: 27px 30px ;
    border-radius: 20px;
    .more{
      float: right;
      margin-top: 20px;
    }
    .bar{
      margin-top: 40px;
    }
  }
  .header{
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 22px;
    color: #333;
    .header-type{
      // max-width: 50%;
      // overflow: scroll;
      // overflow-y:hidden;
      display: flex;
      background-color: #F3F6F9;
      font-size: 16px;
      border-radius: 25px;
      align-items: center;
      height: 50px;
      color: #7E8299;
      .item{
        padding: 10px 22px;
        margin: 0 6px;
        white-space: nowrap;
      }
      .checked{
        border-radius: 25px;
        color: #5AB0EF;
        background: #fff;
      }
    }

    .title{
      color: #333;
      font-weight: 600;
      font-size: 30px;
    }
  }
  .group{
    margin-top: 12px;
  }
  .chart-wrapper {
    padding: 31px 34px 34px 20px;
    margin-top: 32px;
    // height: 261px;
    background: #F4F6F9;
    border-radius: 20px;
    // border: 1px solid #5F7BBC;
    box-sizing: border-box;
    .title{
      display: flex;
      align-items: center;
      font-size: 18px;
      font-weight: 550;
      color: #3F4354;
    }
    .box-total{
      padding-left: 14px;
      .box-total-content{
        display: flex;
        margin-top: 30px;
        .box-total-content-date{
          color: #fff;
          width: 56px;
          height: 56px;
          font-size: 20px;
          line-height: 56px;
          text-align: center;
          background:#29A5FF;
          border-radius: 8px;
        }
        .bg-other{
          background:#F58E44;
        }
        .box-total-content-info{
          padding-left: 10px;
          width: calc(100% - 56px);
          display: flex;
          flex-direction: column;
          justify-content: space-between;
          .price{
            font-size: 30px;
            color: #3F4354;
            font-weight: 550;
          }
          .dec{
            font-size: 16px;
            color: #B5B5C3;
          }
        }
      }
    }
  }
}
</style>
